import type { PlusColumn } from "plus-pro-components";
import { useTable } from "plus-pro-components";

import ThumbUp from "~icons/ri/thumb-up-line";
import Hearts from "~icons/ri/hearts-line";

export const { buttons } = useTable();
// 表格数据
export const tableColumns: PlusColumn[] = [
  {
    label: "需求人数",
    prop: "requiredNumber",
    tableColumnProps: {
      sortable: true,
      showOverflowTooltip: true
    }
  },
  {
    label: "提问数量",
    prop: "questionNumber",
    tableColumnProps: {
      sortable: true,
      showOverflowTooltip: true
    }
  },
  {
    label: "解决数量",
    prop: "resolveNumber",
    tableColumnProps: {
      sortable: true,
      showOverflowTooltip: true
    }
  },
  {
    label: "用户满意度",
    minWidth: 100,
    prop: "satisfaction",
    valueType: "progress",
    tableColumnProps: {
      sortable: true,
      showOverflowTooltip: true
    },
    render: value => (
      <div class="flex justify-center w-full">
        <span class="flex items-center w-[60px]">
          <span class="ml-auto mr-2">{value}%</span>
          <iconifyIconOffline
            icon={value > 98 ? Hearts : ThumbUp}
            color="#e85f33"
          />
        </span>
      </div>
    )
  },
  {
    label: "统计日期",
    prop: "date",
    tableColumnProps: {
      sortable: true,
      showOverflowTooltip: true
    }
  }
];

// 按钮
buttons.value = [
  {
    text: "查看",
    code: "view",
    props: { type: "info", plain: true }
  }
];
